<template>
  <el-container class="main_con">
    <div class="filter_con ds_block">

      <div class="filter_area">
        <el-input
          class="serach_input mr_15 mt_15"
          size="medium"
          placeholder="门店名称"
          v-model="obj.name"
        ></el-input>
        <label class="mr_15 mt_15">状态</label>
        <el-select
          size="medium"
          v-model="obj.status"
          placeholder="请选择"
          class="mr_15 mt_15"
        >
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
        <el-button class="mr_15 mt_15" @click="searchList" size="medium"
          >搜索</el-button
        >
      </div>
    </div>
    <div class="list_con">
      <el-table
        @selection-change="selectItem"
        :data="list"
        element-loading-text=""
        fit
        highlight-current-row
      >
        <el-table-column
          type="selection"
          width="55"
          align="center"
        ></el-table-column>
        <el-table-column type="index" label="序号"></el-table-column>
        <el-table-column prop="name" label="门店名称"></el-table-column>
        <el-table-column prop="mobile" label="联系号码"></el-table-column>
        <el-table-column prop="status_text" label="状态"></el-table-column>
        <el-table-column prop="district,address" label="商户地址">
          <template slot-scope="scope"
            >{{ scope.row.district }},{{ scope.row.address }}</template
          >
        </el-table-column>
        <el-table-column prop="create_time" label="创建时间"></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
         
            <el-button v-has type="text" @click="editItem(scope.row)"
              >配置物流</el-button
            >
           
          </template>
        </el-table-column>
      </el-table>
      <div class="table_footer" v-show="total != 0">
        <el-pagination
          @current-change="changePage"
          class="pages"
          background
          hide-on-single-page
          layout="prev, pager, next"
          :total="total"
        >
        </el-pagination>
      </div>
    </div>
  </el-container>
</template>

<script>
import { getStoreList, delStore, editStore } from "@/api/shop/store";
export default {
  data() {
    return {
      options: [
        {
          value: -1,
          label: "全部",
        },
        {
          value: 1,
          label: "正常",
        },
        {
          value: 0,
          label: "禁用",
        },
      ],
      obj: {
        name: "",
        status: -1,
      },
      objTemp: {},
      total: 0,
      page: 1,
      size: 10,
      isLoading: false,
      list: [],
    };
  },
  components: {},
  mounted() {
    this.searchList();
  },
  methods: {
    //新增门店
    addStore() {
      //导航到新页面
      this.$router.push("/store/storeItem");
    },
    //查询数据
    searchList() {
      //复制查询对象
      this.objTemp = Object.assign({}, this.obj);
      //处理status字段
      if (this.objTemp.status == -1) {
        delete this.objTemp.status;
      }
      this.getDataList();
    },
    //查询数据本体
    getDataList() {
      this.isLoading = true;
      getStoreList(this.objTemp, this.page, this.size)
        .then((res) => {
          this.isLoading = false;
          let o = res.msg;
          this.list = o.data;
          this.total = o.total;
        })
        .catch((e) => {
          this.isLoading = false;
        });
    },
    //启用/禁用门店,auidt = 1时可操作
    upDownItem(obj) {
      let _o = {
        id: obj.id,
        update_time: obj.update_time,
      };
      let s = "";
      if (obj.status == 1) {
        //当前启用,操作后为禁用
        _o.status = 0;
        s = "是否禁用该门店?";
      } else if (obj.status == 0) {
        //当前禁用,操作后为启用
        _o.status = 1;
        s = "是否启用该门店?";
      }
      this.$confirm(s)
        .then((_) => {
          this.isLoading = true;
          editStore(_o)
            .then((res) => {
              this.isLoading = false;
              this.getDataList();
            })
            .catch((e) => {
              this.isLoading = false;
            });
        })
        .catch((p) => {
          //empty
        });
    },
    //编辑数据
    editItem(obj) {
      this.$router.push({ path: "/store/storeItem", query: { id: obj.id } });
    },
    //删除数据
    delItem(id) {
      this.$confirm("是否要删除该条数据？")
        .then((_) => {
          this.isLoading = true;
          delStore(id).then((res) => {
            this.isLoading = false;
            //重新加载数据
            this.getDataList();
          });
        })
        .catch((_) => {
          //出错
        });
    },
    //选择记录
    selectItem(selection) {
      this.listSelected = selection;
    },
    //批量删除商户
    delMul() {
      this.$alert("功能暂未开发!");
    },
    //切换分页
    changePage(page) {
      this.page = page;
      this.getDataList();
    },
  },
};
</script>

<style lang="scss"></style>
